import { createSlice, PayloadAction } from "@reduxjs/toolkit";
import { Post_dao } from "../component/Post";
import { Dispatch } from "redux";
import ajax, { AxiosResponse } from "axios";
export enum PostStatus {
    "idle" = "idle",
    "loading" = "loading",
    "success" = "success",
    "failed" = "failed",
}
export interface PostState {
    status: PostStatus;
    message: string | null;
    list: Post_dao[];
}

const initialState: PostState = {
    status: PostStatus.idle,
    message: null,
    list: [],
};

export const postSlice = createSlice({
    name: "posts",
    initialState,
    reducers: {
        postStatus: (
            state: any,
            action: PayloadAction<{
                status: PostStatus;
                message: string | null;
            }>
        ) => {
            state.status = action.payload.status;
            state.message = action.payload.message;
        },
        postList: (state: any, action: PayloadAction<Post_dao[]>) => {
            state.list = action.payload;
        },
        postNew: (state: any, action: PayloadAction<Post_dao>) => {
            state.list.unshift(action.payload);
        },
        postEmoji: (
            state: any,
            action: PayloadAction<{ id: string; type: string }>
        ) => {
            const oldData = state.list;
            for (let i = 0; i < oldData.length; i++) {
                const item: Post_dao = oldData[i];
                if (item.id === action.payload.id) {
                    item.reactions[action.payload.type] =
                        item.reactions[action.payload.type] + 1;

                    break;
                }
            }
        },
        postEdit: (state: any, action: PayloadAction<Post_dao>) => {
            const oldData = state.list;
            for (let i = 0; i < oldData.length; i++) {
                const item: Post_dao = oldData[i];
                const data = action.payload;
                if (item.id === data.id) {
                    item.title = data.title;
                    item.content = data.content;
                    item.date = data.date;
                    item.author = data.author;
                    break;
                }
            }
        },
    },
});
export const postList_a = () => {
    return (dispatch: Dispatch, getState: any) => {
        const state = getState();

        if (state.posts.list && state.posts.list.length <= 0) {
            dispatch(postStatus({ status: PostStatus.loading, message: null }));

            return ajax
                .get("/data/postList.json")
                .then((res: AxiosResponse<Post_dao[]>) => {
                    setTimeout(() => {
                        dispatch(
                            postStatus({
                                status: PostStatus.success,
                                message: null,
                            })
                        );
                        const { data } = res;
                        if (data) {
                            dispatch(postList(data));
                        } else {
                            dispatch(postList([]));
                        }
                    }, 2000);
                })
                .catch((error) => {
                    dispatch(
                        postStatus({
                            status: PostStatus.failed,
                            message: error.message,
                        })
                    );
                });
        }
    };
};
export const { postStatus, postList, postNew, postEmoji, postEdit } =
    postSlice.actions;
export default postSlice.reducer;
